<template>
  <div class="item">
    <div class="title" :style="minWidth">{{title}}</div>
    <div class="content">
      <slot></slot>
    </div>
  </div>
</template>
<script>
export default {
  props: {
    title: {
      type: String,
      default: '用户名'
    },
    width: {
      type: Number,
      default: 0
    }
  },
  computed: {
    minWidth() {
      return `minWidth: ${this.width}px`
    }
  }
}
</script>
<style lang="stylus" scoped>
@import "~@/assets/styles/variables.styl"
  .item 
    width 100% 
    height 30px
    display flex 
    align-items center
    box-sizing border-box 
    padding-left 15px
    .title 
      color $color-sub-grey 
    .content 
      flex 1
</style>